{% extends "base.html" %}
{% load i18n %}
{% block title %}{% trans "Network Pool" %}{% endblock %}
{% block content %}
    {% include 'sidebar.html' %}
    <div class="main col-xs-12 col-sm-9">
        {% if errors %}
            {% for error in errors %}
                <div class="alert alert-danger">
                    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
                    {{ error }}
                </div>
            {% endfor %}
        {% endif %}
        {% if device %}
            <table class="table table-hover table-nolines" role="main">
                <tbody>
                    <tr>
                        <td>{% trans "Network name" %}</td>
                        <td>
                            [{% for net in networks %}
                                {% ifequal net pool %}
                                    <b>{{ net }}</b>
                                {% else %}
                                    <a href="{% url 'network' host_id net %}">{{ net }}</a>
                                {% endifequal %}
                            {% endfor %} ]
                        </td>
                    </tr>
                    <tr>
                        <td>{% trans "Device" %}</td>
                        <td>{{ device }}</td>
                    </tr>
                    <tr>
                        <td>{% trans "State" %}</td>
                        <td>
                            <form action="" method="post" role="form">{% csrf_token %}
                                {% ifequal state 0 %}
                                    <input type="submit" class="btn btn-xs btn-default" name="start"
                                           value="{% trans "Start" %}">
                                    <input type="submit" class="btn btn-xs btn-default" name="delete"
                                           value="{% trans "Delete" %}" onclick="return confirm('{% trans "Are you sure?" %}')">
                                {% else %}
                                    <input type="submit" class="btn btn-xs btn-default" name="stop" value="{% trans "Stop" %}"
                                           onclick="return confirm('{% trans "Are you sure?" %}')">
                                {% endifequal %}
                            </form>
                        </td>
                    </tr>
                    <tr>
                        <td>{% trans "Autostart" %}</td>
                        <td>
                            <form action="" method="post" role="form">{% csrf_token %}
                                {% ifequal autostart 0 %}
                                    <input type="submit" class="btn btn-xs btn-default" name="set_autostart"
                                           value="{% trans "Enable" %}">
                                {% else %}
                                    <input type="submit" class="btn btn-xs btn-default" name="unset_autostart"
                                           onclick="return confirm('{% trans "Are you sure?" %}')"
                                           value="{% trans "Disable" %}">
                                {% endifequal %}
                            </form>
                        </td>
                    </tr>
                </tbody>
            </table>

            <h3>{% trans "IPv4 configuration" %}</h3>
            <hr>
            <table class="table table-hover table-nolines" role="main">
                <tbody>
                    <tr>
                        <td>{% trans "IPv4 Forwarding" %}</td>
                        <td>
                            {% ifequal ipv4_forward.0 'nat' %}
                                {% trans "NAT" %}
                            {% endifequal %}
                            {% ifequal ipv4_forward.0 'route' %}
                                {% trans "ROUTE" %}
                            {% endifequal %}
                            {% ifequal ipv4_forward.0 'bridge' %}
                                {% trans "BRIDGE" %}
                            {% endifequal %}
                            {% if not ipv4_forward.0 %}
                                {% trans "ISOLATE" %}
                            {% endif %}
                        </td>
                    </tr>
                    <tr>
                        <td>{% trans "Network" %}</td>
                        <td>{{ ipv4_network }}</td>
                    </tr>
                    <tr>
                        <td>{% trans "DHCP" %}</td>
                        <td>
                            {% if ipv4_dhcp_range_start and ipv4_dhcp_range_end %}
                                <span class="label label-success">{% trans "ON" %}</span>
                            {% else %}
                                <span class="label label-danger">{% trans "OFF" %}</span>
                            {% endif %}
                        </td>
                    </tr>
                    {% if ipv4_dhcp_range_start and ipv4_dhcp_range_end %}
                        <tr>
                            <td>{% trans "Start" %}</td>
                            <td>{{ ipv4_dhcp_range_start }}</td>
                        </tr>
                        <tr>
                            <td>{% trans "End" %}</td>
                            <td>{{ ipv4_dhcp_range_end }}</td>
                        </tr>
                    {% endif %}
                </tbody>
            </table>

            {% if fixed_address %}
                <h3>{% trans "Fixed Address" %}</h3>
                <hr>
                <div class="panel-group" id="accordion">
                    <div class="panel panel-default">
                        <div class="panel-heading">
                            <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
                                Show
                            </a>
                        </div>
                        <div id="collapseOne" class="panel-collapse collapse">
                            <div class="panel-body">
                                <div class="input-append form-inline pull-right" style="">
                                    <div class="form-group">
                                        <input type="text" class="form-control" id="filter_input"
                                               style="margin-top:-28px;">
                                    </div>
                                    <input type="button" class="btn btn-default" id="filter_button" value="Filter">
                                    <button type="button" class="btn btn-default" id="filter_clear">Clear</button>
                                </div>
                                <table class="table table-hover">
                                    <thead>
                                    <tr>
                                        <th style="text-align: center">{% trans "Address" %}</th>
                                        <th style="text-align: center">{% trans "MAC" %}</th>
                                    </tr>
                                    </thead>
                                    <tbody style="text-align: center">
                                    {% for fix in fixed_address %}
                                        <tr>
                                            <td>{{ fix.host }}</td>
                                            <td>{{ fix.mac }}</td>
                                        </tr>
                                    {% endfor %}
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
                </div>
            {% endif %}
        {% endif %}
    </div>
    {% include 'sidebar_close.html' %}
{% endblock %}
{% block script %}
    <script>
        $.expr[':'].Contains = $.expr.createPseudo(function (arg) {
            return function (elem) {
                return $(elem).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0;
            };
        });

        $(document).ready(function () {
            // add event button labeled "filter"
            $('#filter_button').click(function (event) {
                // get value
                var filter_val = $('#filter_input').val();
                if (filter_val == '') {
                    // show all
                    $('tbody tr').show();
                } else {
                    // show only matches
                    $('tbody tr:Contains(\'' + filter_val + '\')').show();
                    // hide non-matching items
                    $('tbody tr:not(:Contains(\'' + filter_val + '\'))').hide();
                }
            });

            // add event button labeled "clear"
            $('#filter_clear').click(function (event) {
                $('#filter_input').val('');
                $('#filter_button').click();
            });

            // trigger filter when enter key pressed
            $('#filter_input').keyup(function (event) {
                if (event.keyCode == 13) {
                    $('#filter_button').click();
                }
            });
        });
    </script>
{% endblock %}
